DHE Editor Help
English Version
Introduction
DHE Editor permit the creation of HTML pages from a simple draw done in it compliant to WYSIWYG (What You See Is What You Get).
It uses the absolute HTML positioning present in CSS1.
It has been tested with this browsers:
- Internet Explorer 4 (PC/Mac) and newer;
- Netscape 4 and newer;
- Opera 6 and newer;
- Mozilla/Firefox/Firebird PC-Win, Mozilla PC-Linux;
- Safari (Mac OS X);
- others browsers compatible with CSS1 e DOM2 (all the news).
The Toolbar
It is on the left and contain tools for drawing pages.
Selection
Permits the selection by mouse;
It is the predefined tool and it is selected every time after you draw a new object.
Rectangle
Permits the creation of filled or non filled rectangles with or without border.
Label
All text in your documents will be written using this power tool.
Utilizing the editor you will be able to apply format to piece of text; you can also create links simply making selection and filling fields [name][,href][,target] pushing 'Create Link' button.
You can also create Dynamic HTML events after making selection and pressing 'Events...' button.
Image
You can insert one or more images from file; resizing and apply simply effects to it; export it without doing nothing.
DHE Editor manage multiple image file formats!
HTML
Permits to insert HTML code in a specific location of your page.
Text
Insert an alfanumeric input field in your page.
Button
Insert a button in your page.
Attention: this tools are not generated compatible with Netscape versions 4.x because their management is very different from all others browsers.
DHE Object
You can insert into this page a reference to others .dhe files using the menu tool/import dhe file.
Then you can generate the page in dinamic mode leaving web server create the page at runtime.
This operation is very useful when you have multiple page with the same header; changing the original file, all pages will be updated without regeneration.
Upper Bar
Contains some buttons for more utilized operations in the editor.
New, Open, Save
Copy, Cut, Paste
Properties
Objects Position
Undo, Redo
Preview
Settings
Permits to set some program options.
- Align to Grid
Aligns or not aligns objects to grid
- Show Grid
Shows or Hide the grid
- On Fly Selection
Permits objects selection and moving in one time;
If you don't use this feature you must before select object and then you can operate on it.
- Show Properties after Draw
Shows the properties panel after all new created object
- Grid Width
Set the dimensions of the alignment grid
- Grid Color
Color of the alignment grid
- Backup Files
When you save a file, will be created a copy .BAK.
- Double Click Opens Custom Prop.
Permits to show the Custom Properties window on double clicking over some objects instead to show right properties panel.
- Alternative Browser for Preview
Choose an alternative browser if you dont want the default one.
- Language Selection
Choose your language for editor
Copy Special & Paste Special
Copy Special
Permits to copy one (one and one a time) Label or Picture object to system clipboard sharing it to other programs; It's enabled when a Label or Picture is selected.
Paste Special
Permits to paste on editor text or images containded on system clipboard. This menu is enabled when the clipboard has a text or a picture.
Other Notes:
During normal operations of copy/cut/paste from the label editor the system clipboard is utilized.
So you can copy text and paste it to another program.
Events
With this feature you can assign some actions (show or hide objects, copy picture from one object to another, move objects, execute a specific Javascript function) when a certain situation occurs; this is call Event.
Bot all object can manage events but this is a limitation of Dynamic HTML from some browsers.
Events are managed with this objects:
- Page (the current page);
- Label (in the text editor you can assign event to any selection);
- Picture;
- Input Fields (text, button, option, radio button, etc...).
All object can manage certain events; this is the complete list:
- onMouseOver --> when the mouse is over the object;
- onMouseOut --> when the mouse leave the object;
- onClick/onDblClick --> when the user click a mouse button on the object;
- onBlur --> when a input control lose the focus;
- onChange --> when the value of an input field change;
- onLoad, onUnload, onResize --> only for the page object.
Finally you can easily create Dynamic HTML pages compatible with all browsers.
Using Mouse and Keyboard
Mouse
With the mouse you can draw, resize, move all objects in the page.
It is possible to select more objects at the same time pressing SHIFT and clicking over interested objects.
Also you can make draw a rect with the selection tool including all wanted objects.
Double click over an objects shows the properties window.
If you want to resize or move objects over the page limit simply drag the selection on the scroll bars or the rules; the page will scroll automatically.
If one or more objects are invisible for editor you can select them by mouse pressing the Control Key at the same time.
Keyboard
With the keyboard there are many possible operations:
- Move and Resize a object:
It it possible to move or resize a object keeping it aligned to grid; for this the object must be selected.
These are the keys to be utilized:
<Directional keys> --> shift objects by one pixel;
<Directional keys> + CTRL --> shift and align to grid;
<Directional keys> + SHIFT --> resize objects by one pixel;
<Directional keys> + SHIFT + CTRL --> resize and align to grid.
- Selection All: CTRL + A
- Invert Selection: *
- Objects Copy: CTRL + C
- Objects Cut: CTRL + X
- Object Delete: CANC
- Next object: +
- Previous object: -
- Page Down or Up: PG DOWN o PG UP
- Start: HOME
- Save: CTRL + S
- New File: CTRL + N
- Copy Special: CTRL + B
- Paste Special: CTRL + W
- Undo: CTRL + Z
- Move objects under cursor to bottom: ENTER
- Move objects under cursor to up: BACK SPACE
Tip: What is the cursor?
Cursor is the cross that appears sometimes in the background.
For setting it you have to left click the mouse on page.
Pressing ENTER all objects under it will be moved to bottom; pressing BACKSPACE to top.
RollOver and RollClick
These properties give you the ability of change a picture when mouse go over it or when you click on it.
Simply click on a picture and select RollOver Image and/or RollClick Image.
System Requirements
The program need almost 15 MB of RAM memory and 15 MB of disk space for the components and the temporaly files.
The space depends to number of images in the page.
It is compatible with all Windows version.
Utilized Tecnologies
The program was written using Visual Basic 6.
3rd part software:
- This software uses then famous free library FreeImage.dll for image loading.
You can download FreeImage from internet http://www.6ixsoft.com or
http://sourceforge.net/projects/freeimage.
- This product includes software developed by vbAccelerator (http://vbaccelerator.com/).
